Dans cette leçon, nous examinerons de plus près la gestion des nouvelles fenêtres de navigateur avec la classe de
proxy de fenêtre de navigateur, je dis classe car l'instance de proxy de fenêtre de navigateur est fournie par électron, un peu comme
l'instance principale de l'application et non un module dont nous avons besoin. .
Maintenant, il y a deux façons pour qu'électron crée automatiquement une nouvelle fenêtre de navigateur, la
première étant de cliquer sur notre lien avec un attribut cible de trait de soulignement vierge et la seconde, ce
que nous allons utiliser est d'appeler la fenêtre native du navigateur Windows. fonction ouverte.
C'est alors cette fonction sur laquelle l'électron retournera un objet proxy de fenêtre de navigateur.
Permettez-moi de vous montrer à nouveau, en travaillant dans l'index DOT, XHTML ou le processus de rendu.
Je vais me débarrasser de tout ça.
Ajout d'un élément H3 avec un lien vers le développeur Dot Mozilla dot org ou tout autre téléchargeable.
Vous êtes tous appelés cette nouvelle fenêtre.
Et surtout, ouvrir ce lien dans une nouvelle instance de fenêtre de navigateur à Target équivaut à un trait de soulignement
vide.
Je vais également rendre les liens de page blancs, le bleu foncé par défaut étant un peu difficile à voir
pour le moment, ils sont en sécurité sur l'application, que j'ai déjà en cours d'exécution.
Actualisez la fenêtre principale qui se recharge indexée sur HTML.
Je vais continuer et cliquer sur ce nouveau lien de fenêtre.
Et comme prévu, Electron crée automatiquement une nouvelle instance de fenêtre de navigateur avec le contenu de ce
lien chargé en tant que contenu Web.
Mais s'il est très pratique de créer cette nouvelle fenêtre pour nous, nous n'avons pas de référence à celle-ci dans
notre code et ne pouvons donc en aucun cas la contrôler.
Mis à part quelques éléments d'interface utilisateur standard, le système d'exploitation fournit cet être où nous pouvons maintenant utiliser à
la place les fenêtres ouvertes pour obtenir une référence à cette fenêtre.
Voyons donc que je vais couper ce lien, changer l'avion en hash à la place.
Ce n'est pas une exigence, mais cela garantira simplement les liens, l'apparence et le comportement
comme il se doit, en ajoutant un attribut de déclic, cela revient à écouter un clic sur l'élément dans lequel
notre nouveau noyau gagne ou une nouvelle fenêtre à ce fonction.
Je vais juste garder ça en ligne pour le moment.
Supprimez donc le rendu dot js.
Une nouvelle victoire acquise équivaut à une fonction.
Dans lequel notre fenêtre d'appel s'ouvre avec ce Mozilla, vous êtes maintenant exactement la même chose que d'utiliser simplement
le lien avec l'attribut target blank.
Mais la raison pour laquelle nous faisons cela est d'avoir une référence à cette nouvelle fenêtre,
créer une variable globale pour contenir cette référence, laisser lors de l'attribution pour gagner la valeur de retour de window dot open étant la sauvegarde de
l'objet proxy de la fenêtre du navigateur.
Fermez ceci, rechargez la fenêtre, cliquez sur le lien, qui fonctionne exactement comme avant, mais maintenant nous avons une référence à cette
fenêtre sur la variable vent globale de la fenêtre principale.
Vérifiez cela dans les fenêtres.
Les outils de développement console lorsque le nom de cette variable, qui déconnecte un instant du proxy de la fenêtre du navigateur avec certaines méthodes de fenêtre
de navigateur familières telles que la mise au point rapprochée, le flou, etc. proxy de fenêtre de navigateur, étant essentiellement une version
limitée d'une instance de fenêtre de navigateur standard.
Donc, avec cette référence à notre disposition, voyons quelques exemples de la façon dont nous pourrions l'utiliser.
Je vais ajouter un nouveau lien appelant fermé quand?
Étiquetez cette fenêtre de fermeture, créez cette fonction consommée close win équivaut à une fonction dans laquelle nous pouvons
utiliser cette référence de fenêtre globale pour fermer la deuxième fenêtre après
l'avoir ouverte.
Gardez à l'esprit que cela ne fonctionnera qu'après avoir créé une nouvelle fenêtre et avoir une
référence à la nouvelle fenêtre d'enregistrement.
Débarrassez-vous de cette deuxième fenêtre, rechargez le contenu, qui ajoute le nouveau lien, ouvrez les fenêtres avant et maintenant avec cette
référence globale disponible cliquez sur fenêtre fermée, ce qui ferme la nouvelle fenêtre de la fenêtre principale
où elle a été créée.
Encore une fois, cela revient exactement à utiliser le module complet de la fenêtre du navigateur, par exemple, dans la
documentation.
Nous avons également un flou de focus et pour exécuter JavaScript sur un objet proxy de fenêtre de navigateur maléfique.
Voyons que je vais ajouter un autre lien appelant le style win.
Étiquetez ce mauvais, Font's.
Créez cette fonction de style win pour ce lien dans lequel nous pouvons maintenant exécuter du code
JavaScript à partir du contenu Web principal de Windows dans la nouvelle fenêtre lors de l'évaluation, je donnerai au contenu Web
de cette fenêtre une mauvaise police selon l'étiquette en cours d'exécution du document doget éléments par nom de balise.
Donc en sélectionnant toutes les balises HTML correspondantes sur le document H1.
Nous ne sommes intéressés que par le premier de ceux-ci, alors sélectionnez les éléments zéro
du paramètre de tableau sur cette famille de polices de propriété de style d'élément d'en-tête égale à comic sans MS save recharger le contenu de la fenêtre principale ouvrir la
nouvelle fenêtre.
Et maintenant, qu'il s'agisse d'un contenu distant, nous avons une référence à cette fenêtre, ce qui signifie que nous
pouvons contrôler tout son contenu.
Cliquez sur ce nouveau lien et là, nous voyons que le changement de titre principal H1 en Comic Sans.
Donc, avoir une référence à une fenêtre de navigateur créée avec un point de fenêtre ouvert est génial.
Mais disons que nous voulons réellement changer la façon dont cette fenêtre est créée.
Nous pouvons le faire aussi.
Vers la documentation électronique pour window dot open.
Nous voyons cela comme le premier argument que vous pouvez charger dans la nouvelle fenêtre comme nous l'avons dans
notre code.
Et puis deux paramètres optionnels étant le nom de la fenêtre.
Pas beaucoup d'utilité car l'élément de titre HTML l'écrasera et présente ces fonctionnalités de fenêtre de navigateur ou d'options
sous forme de chaîne.
Si nous vérifions les documents de la fenêtre du navigateur standard, et non le proxy de la fenêtre du navigateur un peu en
bas de la page, nous pouvons construire nos options pour une nouvelle fonctionnalité de la fenêtre du navigateur.
Voyons un exemple.
Tout d'abord, je vais définir le titre de la fenêtre comme cela est maintenant requis lors de l'utilisation du troisième argument,
également un soulignement vide car il n'est pas utilisé, puis sous forme de chaîne certaines fonctionnalités.
Par exemple, disons que la nouvelle largeur des fenêtres est égale à 500 virgule pour séparer les options
de hauteur égale à 450 virgule et toujours en haut égale à un.
Ceci étant l'équivalent de vrai.
Le vrai mot-clé ne fonctionnera pas dans ce format.
Sauver.
Rechargez le contenu.
Nouvelle fenêtre, et cette fois-ci, la nouvelle fenêtre est créée à nos dimensions spécifiées tout en étant censée rester toujours
au-dessus des autres fenêtres, mettre la fenêtre principale en évidence, et comme prévu, elle reste derrière la
nouvelle fenêtre bien qu'elle soit active fenêtre focalisée.
Ainsi, comme vous pouvez le voir, en utilisant la méthode d'ouverture de fenêtre native, ainsi que l'implémentation par
electron d'une fenêtre de navigateur proxy, nous pouvons gérer des instances dynamiques de fenêtres de navigateur directement à partir des
retraits de rendu responsables de leur création.
Nous verrons un cas d'utilisation plus pratique de cela plus tard dans le cours.